<template>
  <div class="f-columnY container">
    <div class="f-centerY header">
      推送可视对讲门口机
    </div>
    <div class="f-flex1 f-flex content">
      <!-- 树结构 -->
      <tree @getMessage="getMessage"></tree>
      <div class="f-flex1 textarea-wrap">
        <el-input
          type="textarea"
          :autosize="{ minRows: 15, maxRows: 30}"
          placeholder="请输入内容"
          v-model="textarea2">
        </el-input>
        <el-button type="primary" class="push">推送到可视对讲门口机</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import Tree from './Tree'
export default {
  name: 'Personnel',
  components: {
    Tree
  },
  data() {
    return {
      tree: [],
      textarea2: '',
      defaultProps: {
        children: 'children',
        label: 'label',
        disabled: 'disabled'
      },
      nodeData: {  // 选中数据
        title: '',
        items: []
      },   
    }
  },
  mounted() {
    console.log('route', this.$route)
  },
  methods: {
    // 新增
    append(node, data) {
      this.selectNode = node
      this.selectData = data
      this.$refs.add.toggleAdd(true, 'default')
    },
    // 获取右侧展示数据
    getMessage(data) {
      console.log(1111, data)
      this.nodeData = data
    }

  }
}
</script>

<style lang="scss" scoped>
  .container {
    height: 100%;
    .header {
      padding-left: 30px;
      height: 70px;
      border-bottom: 1px solid #ebeef5;
      font-size: 17px;
      font-weight: 600;
      letter-spacing: 1px;
      color: #000;
    }
    .content {
      .textarea-wrap {
        padding: 30px 40px;
        .push {
          float: right;
          margin: 30px 20px;
        }
      }
    }
  }
</style>

